@mixin border($color,$width) {
    & { 
      position: relative;
      &:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;

        border-style: solid;
        border-color: $color;
        border-width: $width;
        transform-origin: 0 0;
        // padding: 1px;
        box-sizing: border-box;
        pointer-events: none;
      }
      &:last-child:before {
        // border-top:none;
      }
    }
    @media (-webkit-min-device-pixel-ratio:1),(min-device-pixel-ratio:1) {
      &:before {
        width: 100%;
        height: 100%;
        transform: scale(1);
      }
    }
    @media (-webkit-min-device-pixel-ratio:2),(min-device-pixel-ratio:2) {
      &:before {
        width: 200%;
        height: 200%;
        transform: scale(0.5);
      }
    }
    @media (-webkit-min-device-pixel-ratio:3),(min-device-pixel-ratio:3) {
      &:before {
        width: 300%;
        height: 300%;
        transform: scale(0.333);
      }
    }
}